window.onload = function () {
    const codeSpan = document.querySelector('.code span')
    const img = document.querySelector('.set a img')
    const form = document.querySelector('form')
    const one = document.querySelector('#one')
    const two = document.querySelector('#two')
    const three = document.querySelector('#three')
    const errorCode = document.querySelector('.errorCode')
    const ban = document.querySelector('.ban')
    const error = document.querySelector('.error')
    const error1 = document.querySelector('.error_1')
    const sucess= document.querySelector('.sucess')
    const eye = document.querySelector('.eye')
    const label = document.querySelector('.label')
    let flag = true
    let random = []
    let item = []
    let password = []
    let allow = true
    let ps = true
    const reg = /^[a-zA-Z]\w{1,8}$/
    //获取本地数据
     let  useArr  = JSON.parse(localStorage.getItem('ledgerUsers') || [])
    //获取手机号
     useArr.forEach(function (items, index) { 
        item.push(items.tel);
        password.push(items.password)
     })
    //顶部返回主页
    img.addEventListener('touchstart',function(){
        location.href = './系统设置.html'
    })
    //随机生成六位数验证码
    function generateRandomNumFour() {
        let result = '';
        for(let i = 0; i< 6; i++) {
        result += Math.floor(Math.random() * 10).toString();
        }
        return result;
    }
    //判断确认修改按钮是否禁用
    function next (){
        if(allow && two.value === random[0] && reg.test(three.value)){
            ban.disabled = false
            ban.style.background = '#EF4F3F'
           }else{
            ban.disabled =true
           } 
       }
    //已绑手机号验证
    one.addEventListener('change',function(){
        allow =item.find((ele) => ele === one.value);
        codeSpan.addEventListener('touchstart',function(){
            if(flag){
              flag = false
              let index =60
              random.push(generateRandomNumFour())
              const setTime = setInterval(() => {
                  index--
                  codeSpan.style. paddingLeft =  '8px';
                  codeSpan.innerHTML = `${index}s后重新获取`
                  if(index === 0){
                      clearInterval(setTime)
                      flag = true
                      codeSpan.innerHTML = '获取验证码'
                  }
              }, 1000);
              errorCode.style.display = 'block'
              errorCode.innerHTML = `验证码是:${random[0]}`
            }
          })
          if(allow){
            error.style.display = 'none'
         }else{
            error.style.display = 'block'
        }
        next()
    })
    //验证码验证
    two.addEventListener('change',function(){
        if(two.value === random[0]){
            errorCode.style.display = 'none'
        }else{
            errorCode.innerHTML = `验证码输入有误! 请重新输入`
            errorCode.style.display = 'block'
        }
        next()
    })
    //新密码
    three.addEventListener('change',function(){
    ps =password.find((ele) => ele === three.value);
    if(reg.test(three.value) === true){
        error1.style.display = 'none'
    }else{
        error1.style.display = 'block'
    }
    next()
    })
    label.addEventListener('touchstart',function(){
        three.classList.toggle('on')
        if(three.classList.contains('on')){
            three.type = 'password'
            eye.style. backgroundImage = 'url(./images/眼睛_闭.png)'
        }else{
            three.type = 'text'
            eye.style. backgroundImage = 'url(./images/眼睛3.png)'
        }
    })
    //是否修改并页面跳转
    ban.addEventListener('touchstart',function(e){
    e.preventDefault()
    if(allow && two.value === random[0] && reg.test(three.value)){
        useArr.forEach(function (items, index) { 
            if(items.tel === allow){
             items.password = three.value
            }
         })  
         localStorage.setItem("ledgerUsers", JSON.stringify(useArr))
       let num = 3
      const setTime1 = setInterval(() => {
         num--
         sucess.style.display = 'block'
         if(num === 0){
            clearInterval(setTime1)
            sucess.style.display = 'none'
        }
       }, 1000);
    }
    setTimeout(() => {
        location.href = './系统设置.html'
    }, 3000); 
    })
}